const hobby = [
  {
    value: '选项1',
    label: '黄金糕'
  }, {
    value: '选项2',
    label: '双皮奶'
  }
]

export default {
  data () {
    return {
      // 列数据参数
      columns: [
        {
          label: '姓名',
          prop: 'name'
        },
        {
          label: '年龄',
          prop: 'age'
        },
        {
          label: '爱好',
          prop: 'hobby',
          render: (h, params) => {
            return (
              <el-select v-model={params.row.hobby}>
                {hobby.map((k) => (<el-option value={k.value}>{k.label}</el-option>))}
              </el-select>
            )
          }
        },
        {
          label: '时间',
          prop: 'time',
          render: (h, params) => {
            return (
              <el-date-picker
                type= 'datetime'
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd"
                v-model={params.row.time}/>
            )
          }
        },
        {
          button: true,
          label: '操作',
          // mode: 'normol', // 模式为详情时不会渲染
          group: [
            {
              label: '编辑',
              type: 'warning',
              icon: 'el-icon-edit',
              plain: true,
              disabled: false,
              onClick: (row, index) => {
                this.handleEdit(row, index)
              }
            },
            {
              label: '删除',
              type: 'danger',
              icon: 'el-icon-delete',
              plain: false,
              disabled: false,
              onClick: (row, index) => {
                console.log(this)
                this.handleDel(row, index)
              }
            }
          ]
        }
      ],
      // 分页参数
      pagination: {
        total: 0,
        pageIndex: 1,
        pageSize: 15,
        pageSizeArr: [20, 100]
      },
      // table 的参数
      options: {
        mutiSelect: true,
        index: true, // 显示序号， 多选则 mutiSelect
        loading: false, // 表格动画
        initTable: true // 是否一挂载就加载数据
      }
    }
  }
}
